{% extends 'base.html' %}
{% load staticfiles %}

{% block title %}预警分析页{% endblock %}

{% block my_css %}

    <link rel="stylesheet" href="{% static 'css/warnlist.css' %}">
    <link rel="stylesheet" href="{% static 'css/video-js.css' %}">

{% endblock %}

{% block nav-warn %}active-tab{% endblock %}

{% block content %}

    <div class="warnlist-title">
        <div class="warnlist-body">
            {% comment %} <div class="layui-fluid">
            <div class="layui-row">
                <div class="warn-title">
                    <p>预警处理</p>
                </div>
            </div>
        </div> {% endcomment %}

            <div class="layui-fluid">
                <table id="warn-table" lay-filter='warnlist' lay-data="'{id: 'warn-check'}">

                </table>
            </div>
        </div>
    </div>

    <!-- 一键处理弹窗 -->
    <div class='' id="all-warn" style="display: none">
        <button class="layui-btn layui-btn-warm" id="all-del">跳过</button>
        <button class="layui-btn layui-btn-normal" id="all-save">处理</button>
    </div>

    <!-- 发送窗口弹出层
        <div class="warn-send" id="warn-send" style="display: none">
            <p>这里是处理发送</p>
        </div>
        -->

    <!-- 显示弹窗图片 -->
    <div id="image-views" style="display: none">

    </div>

    <!-- 弹窗播放视频 -->
    <div style="display: none" id="video-views" class="video-views">
        <video id="play-video" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto"
               autoplay="autoplay" width="680" height="400" data-setup='{}'>

        </video>
    </div>

    {% include 'warnlist/select_base.html' %}

    <!-- 标注图片展示 -->
    {#<div class="warn-image" id="image-url" style="display: none">#}
    {#    <canvas id="canvasId">#}
    {##}
    {#    </canvas>#}
    {#</div>#}

{% endblock %}

{% block my_js %}

    <!-- 列事件 -->
    <script type="text/html" id="warn-make">
    <img src="{% static 'images/delete.png' %}" alt="" id="warn-del" lay-event="warn-del"
             style="cursor: pointer;">
    <img src="{% static 'images/update.png' %}" alt="" id="warn-save" lay-event="warn-save"
             style="cursor: pointer; margin-left: 30px">

{#        <button class="layui-btn layui-btn-warm" id="warn-del" lay-event="warn-del">跳过</button>#}
{#        <button class="layui-btn layui-btn-normal" id="warn-save" lay-event="warn-save">处理</button>#}
    </script>

    {% include 'warnlist/script_base.html' %}

    <script type="text/html" id="warn-type">
        <span>△</span>
    </script>

    <!-- 显示事件图片 -->
    <script type="text/html" id="warns-image">
        {% verbatim %}
        <div style="height: 100px;" lay-event="view-warns">
            <img src="{{ d.image }}" alt="">
        </div>
        {% endverbatim %}
    </script>

    <script type="text/html" id="warn-image">
        <button class="layui-btn layui-btn-normal" lay-event="view-image">双击查看</button>
    </script>

    <script type="text/html" id="add-image">
        {% verbatim %}

        {{ each data image index }}

        <img src="{{ image.image_url }}" alt="" id="image{{ index }}">

        {{ /each }}

        {% endverbatim %}
    </script>

    <script type="text/html" id="select-dev">
        {% verbatim %}

        {{ each data dev index }}

        <input type="checkbox" name="dev" value="{{ dev.id }}" title="{{ dev.name }}">

        {{ /each }}

        {% endverbatim %}
    </script>

    <script type="text/html" id="warn-video">
        <img src="{% static 'images/play.png' %}" alt="" lay-event="view-video"
             style="cursor: pointer; width: 38px; height: 35px">
        {#    <button class="layui-btn layui-btn-normal" lay-event="view-video">观看</button>#}
    </script>

    <script src="{% static 'js/template-web.js' %}"></script>
    <script src="{% static 'js/warn_list.js' %}"></script>
    <script src="{% static 'js/video.js' %}"></script>

{% endblock %}